<%-- 
    Document   : reminders
    Created on : Mar 5, 2011, 3:31:39 PM
    Author     : Javier
--%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<%@page contentType="text/html" pageEncoding="UTF-8"%>

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>


<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Checkout</title>
        <link rel="stylesheet" href="${pageContext.servletContext.contextPath}/css/template_css.css" media="screen" type="text/css" />
        <!-- calendar stylesheet -->
        <link rel="stylesheet" type="text/css" media="all" href="${pageContext.servletContext.contextPath}/js/calendar-win2k-cold-1.css" title="win2k-cold-1" />

        <!-- main calendar program -->
        <script type="text/javascript" src="${pageContext.servletContext.contextPath}/js/calendar.js"></script>

        <!-- language for the calendar -->
        <script type="text/javascript" src="${pageContext.servletContext.contextPath}/js/lang/calendar-en.js"></script>

        <!-- the following script defines the Calendar.setup helper function, which makes
             adding a calendar a matter of 1 or 2 lines of code. -->
        <script type="text/javascript" src="${pageContext.servletContext.contextPath}/js/calendar-setup.js"></script>
        <script type="text/javascript" src="${pageContext.servletContext.contextPath}/js/modalpopup.js"></script>

    </head>
    <body>
        <div class="container">
            <div class="header"><a href="#"><img src="${pageContext.servletContext.contextPath}/img/grlg.png" alt="Insert_logo" name="Insert_logo" width="180" height="90" id="Insert_logo" style="background: #C6D580; display:block;"></a>
                <!-- end .header --></div>
            <div class="sidebar1">
                <ul class="nav">
                    <li><a href="#" onclick="overlay()"><strong>Customer PIN</strong></a></li>
                    <li><html:link page="/views/RegisterRemindMenu.jsp"><strong>Remind Plan</strong></html:link></li>
                    <li><html:link action="logout"><strong>Logout</strong></html:link></li>
                    <li><a href="#"><strong>Help</strong></a></li>
                </ul>
                <p><strong>Call 0598-2333579 for more help</strong></p>
            </div><!-- end .sidebar1 -->

            <div class="content">
                <table width="100%" border="0" cellspacing="0" cellpadding="0"
                       class="table-wrapper">
                    <tr>
                        <td>
                            <table width="625" border="0">
                                <tr>
                                    <td width="200"><h3>Checkout</h3> </td>
                                    <td>Customer: ${customer.name} ${customer.familyName}</td>
                                </tr>
                            </table>
                            <table width="625" border="1">
                                <tr>
                                    <th width="35" height="29">&nbsp;</th>
                                    <th width="70">ID</th>
                                    <th width="250">Description</th>
                                    <th width="50">Qty</th>
                                    <th width="100">Price</th>
                                    <th width="120">Total</th>
                                </tr>
                            </table>
                            <html:form action="deleteCheckoutRow" method="post" >
                                <div style="width:645px;height:230px;overflow:auto;">
                                    <table width="625" border="1">
                                        <c:forEach var="row" items="${sale.rows}" >
                                            <tr>
                                                <td width="35"><html:multibox  value="${row.rowNumber}" property="selectedRows" /></td>
                                                <td width="70"> ${row.item.id} </td>
                                                <td width="250"> ${row.item.description} </td>
                                                <td width="50" style="text-align: right"> ${row.quantity} </td>
                                                <td width="100" style="text-align: right"><fmt:formatNumber pattern="$###0.00"> ${row.unitPrice} </fmt:formatNumber> </td>
                                                <td width="120" style="text-align: right"><fmt:formatNumber pattern="$###0.00"> ${row.price} </fmt:formatNumber> </td>
                                            </tr>
                                        </c:forEach>
                                    </table>
                                </div>
                                <table width="625" border="0">
                                    <tr><td><html:submit value="Delete selected" /></td></tr>
                                </table>
                            </html:form>
                            <html:form action="addCheckoutRow" method="post" >
                                <table width="625" border="0">
                                    <tr>
                                        <td width="35" >ID:</td>
                                        <td width="70" > <html:text property="itemId" size="10"/></td>
                                        <td width="250" >Qty: <html:text property="quantity" value="1" size="5" />
                                            &nbsp; <html:submit value="add"/></td>
                                        <td width="50" > &nbsp;</td>
                                        <td width="100" >Subtotal: </td>
                                        <td width="120" style="text-align: right"><fmt:formatNumber pattern="$###0.00"> ${sale.subTotal} </fmt:formatNumber></td>
                                    </tr>
                                    <tr>
                                        <td>&nbsp;</td>
                                        <td>&nbsp;</td>
                                        <td>&nbsp;</td>
                                        <td>&nbsp;</td>
                                        <td>Tax: </td>
                                        <td style="text-align: right"><fmt:formatNumber pattern="$###0.00"> ${sale.tax} </fmt:formatNumber> </td>
                                    </tr>
                                    <tr>
                                        <td>&nbsp;</td>
                                        <td>
                                        &nbsp;

                                        </td>
                                        <td>&nbsp;</td>
                                        <td>&nbsp;</td>
                                        <td>Total: </td>
                                        <td style="text-align: right"><strong><fmt:formatNumber pattern="$###0.00"> ${sale.total} </fmt:formatNumber></strong> </td>
                                    </tr>
                                </table>
                            </html:form>

                            <form action="${pageContext.servletContext.contextPath}/pay.do" method="post" >
                                <html:link action="cancelCheckout">Cancel</html:link>&nbsp;&nbsp;
                                <input type="submit" value="Pay" />
                            </form>

                            <div style="padding: 15px"> <html:errors /></div>
                        </td>
                    </tr>
                </table>
            </div>
        </div><!-- end .container -->
        <div class="footer">
            <p>Copyright 2011&nbsp;TigerSoft</p>
        </div><!-- end .footer -->


        <div id="overlay">
            <div>
                <table width="100%" cellpadding="2" cellspacing="0" border="0">
                    <tr>
                        <td align="left" style="width: 60%; background-color:#003399; color :White; font-weight:bold";valign="top" >
                            Customer PIN
                    </td>
                    <td style="width: 40%;background-color:#003399; color :White; font-weight:bold;" align="right" valign="top">
                        <a href="#" onclick="overlay()" style ="color :White;">Close</a>
                    </td>
                </tr>
            </table>
            <table>
                <tr>
                    <td>
                        Enter Customer PIN:
                    </td>
                    <td colspan ="2" align ="center" >
                        <html:form action="customerPin" method="post">
                            <html:text property="pin" />
                            <html:submit onclick="overlay()" />
                        </html:form>
                    </td>
                </tr>
            </table>
        </div>
    </div>
</body>
</html>
